<!DOCTYPE html>
<html>
<head>
    <style>
        .color-text {
            margin-top: 20px;
            font-size: 24px;
        }
        button {
            margin-left: 10px;
            padding: 5px 15px;
        }
    </style>
</head>
<body>
    <!-- 颜色选择下拉菜单 -->
    <select id="colorSelect">
        <option value="red">红</option>
        <option value="yellow">黄</option>
        <option value="blue">蓝</option>
    </select>
    
    <!-- 确认按钮 -->
    <button onclick="changeColor()">确定</button>
    
    <!-- 显示文字的容器 -->
    <div class="color-text" id="coloredText">文字颜色会改变</div>

    <script>
        function changeColor() {
            // 获取选中的颜色值
            const colorSelect = document.getElementById('colorSelect');
            const selectedColor = colorSelect.value;
            
            // 获取文字元素
            const textElement = document.getElementById('coloredText');
            
            // 修改文字颜色
            textElement.style.color = selectedColor;
        }
    </script>
</body>
</html>